<template>
    <Table class="tableList" :data="overlayList" highlight-current-row @current-change="handleCurrentChange" :show-page="false">
        <el-table-column type="index" label="序号" />

        <el-table-column label="预览">
            <template #default="scope">
                <div class="imgBox">
                    <div class="imagePreview" :style="scope.row.styleObject" />
                </div>
            </template>
        </el-table-column>

        <el-table-column prop="body[0].value" label="评论" />
    </Table>
</template>

<script setup lang="ts">
import {defineEmits} from "vue";
import Table         from '@/components/table/index.vue'

const props = defineProps({
    overlayList: Array,
    url        : String
})

const emits = defineEmits(["clickOverlay"])

// 点击列表
function handleCurrentChange(value: any) {
    emits("clickOverlay", value?.id)
}

</script>

<style scoped lang="scss">
.tableList {
    height: 100%;

    .imgBox {
        width: 100px;
        height: 100px;
        display: flex;
        justify-content: center;
        align-items: center;

        .imagePreview {
            background-image: url("https://img.zcool.cn/community/018e865e16a3a1a8012165180a1435.jpg@1280w_1l_2o_100sh.jpg");
            background-repeat: no-repeat;
        }
    }
}
</style>
